<template>
    <div>
        <p ref='p1' @click="addCount">count:{{ count }}</p>
    </div>
</template>

<script setup>
// 在组合式语法中 使用nextTick
//  nextTick 中可以获取最新的dom

// 语法1:  nextTick(()=>{ 获取最新的dom })
// 语法2:  async function(){ await nextTick();  获取最新的dom}
import { ref, reactive, nextTick } from 'vue'
const count = ref(100);

const p1 = ref(null);
// 语法1: 获取最新的dom
// const addCount = () => {
//     count.value++;

//     nextTick(() => {
//         console.log('p1', p1.value.innerHTML);
//     })
// }

// 语法2: 
const addCount = async () => {
    count.value++;
    console.log(nextTick());
    await nextTick()
    console.log('p1', p1.value.innerHTML);
}


</script>
<style scoped></style>